
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>焦点图</title>    
    <link rel="stylesheet" href="../../css/swiper.min.css">
    <link rel="stylesheet" href="../../css/daping.css">
</head>
<body>
    <!-- 焦点图 -->
    <div class="swiper-container">
        <div class="swiper-wrapper">
            <div class="swiper-slide"><img src="../../images/banner.jpg"><span>第1张图片的描述</span></div>
            <div class="swiper-slide"><img src="../../images/banner.jpg"><span>第2张图片的描述</span></div>
            <div class="swiper-slide"><img src="../../images/banner.jpg"><span>第3张图片的描述</span></div>
            <div class="swiper-slide"><img src="../../images/banner.jpg"><span>第4张图片的描述</span></div>
            <div class="swiper-slide"><img src="../../images/banner.jpg"><span>第5张图片的描述</span></div>
            <div class="swiper-slide"><img src="../../images/banner.jpg"><span>第6张图片的描述</span></div>
            <div class="swiper-slide"><img src="../../images/banner.jpg"><span>第7张图片的描述</span></div>
            <div class="swiper-slide"><img src="../../images/banner.jpg"><span>第8张图片的描述</span></div>
            <div class="swiper-slide"><img src="../../images/banner.jpg"><span>第9张图片的描述</span></div>
            <div class="swiper-slide"><img src="../../images/banner.jpg"><span>第10张图片的描述</span></div>
        </div>
        <!-- Add Pagination -->
        <div class="swiper-pagination"></div>
    </div>
    <!-- 焦点图 end -->    

    <script src="../../js/jquery.min.js"></script>
    <script src="../../js/swiper.jquery.min.js"></script>    
    <script>
    var swiper = new Swiper('.swiper-container', {
        pagination: '.swiper-pagination',
        paginationClickable: true
    });
    </script>
</body>
</html>